<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css">
		.bg{
		/*	height: 100vh;*/
		}
	</style>
</head>
<body>
<div style="position: relative;" id="bgImg">
	<img src="shareBg.png" class="bg">
	<img src="photo.png" style="position: absolute;top:20.5%;width:250px;height: 250px;border-radius: 50%;left:250px">
	<img src="ewm.png" style="position: absolute;top:62.4%;left:225px;width:300px;height:300px;">
</div>
<img src="" id="preview">
<script type="text/javascript" src="html2canvas/html2canvas.js"></script>
<script type="text/javascript" src="html2canvas/canvas2image.js"></script>
<script type="text/javascript">
	
html2canvas(document.getElementById("bgImg"), {scale:2,logging:false,useCORS:true}).then(function(canvas) {
			var img=canvas.toDataURL("image/png");
        	document.body.appendChild(img);
            
})
</script>
</body>
</html>